@charset "utf-8";
.eg{font-size:1.6rem;color:#b3b3b3}
.chatbox{display:none;position:fixed;z-index:999;right:50%;bottom:50%;width:730px;height:510px;margin-right:-365px;margin-bottom:-255px;background-color:#465a63;text-align:center;-webkit-box-shadow:0 0 10px rgba(7,0,2,0.1);-moz-box-shadow:0 0 10px rgba(7,0,2,0.1);box-shadow:0 0 10px rgba(7,0,2,0.1)}
.chatbox .hd{position:relative;height:49px;margin:0 auto;background-color:#fff;text-align:left;line-height:40px;border-bottom:1px solid #d9d9d9}
.chatbox .hd .tt{display:block;padding-left:15px;line-height:48px;font-size:18px;color:#1a1a1a;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.chatbox .hd .min,.chatbox .hd .close{position:absolute;width:17px;height:17px;right:12px;top:12px;font-size:15px;line-height:17px;text-align:center;cursor:pointer;color:#333;font-style:normal;opacity:1}
.chatbox .hd .close:hover,.chatbox .hd .min:hover{color:#ccc}
.chatbox .hd .min{right:36px}
.chatbox .bd{margin:0}
.chatbox .name{display:block;padding-top:30px;margin:0 10px 0 30px;color:#1a1a1a;font-size:14px;text-align:left;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.chatbox .sex{color:#1a1a1a;padding-top:10px;margin:0 10px 0 30px;text-align:left}
.chatbox .country{color:#1a1a1a;padding-top:10px;margin:0 10px 0 30px;text-align:left}
.chatbox .province{color:#1a1a1a;padding:10px 0 0;margin:0 10px 0 30px;text-align:left}
.chatbox .bd .mn{float:left;width:100%}
.chatbox .bd .mnc{float:left;width:450px;height:460px;margin-right:140px;background-color:#fff}
.chatbox .bd .sd{position:relative;float:right;width:140px;margin-left:-140px}
.chatbox .bd .msg-list{position:relative;width:100%;height:310px;overflow:auto;padding:0 -15px 0 0;margin:0}
.chatbox .msg-list ul{margin:0;padding:0 25px 0 15px}
.chatbox .msg-list li{float:left;width:100%;margin:10px 0;list-style:none}
.chatbox .msg-list .timeline{text-align:center;color:#7d7d7d;font-size:12px;line-height:20px;margin:3px 0;}
.chatbox .msg-list .avatar{position:relative;top:-4px;display:inline-block;width:32px;height:32px;line-height:32px;font-size:15px;background-color:#e8e8e8;color:#fff;-webkit-border-radius:16px;-moz-border-radius:16px;border-radius:16px}
.chatbox .msg-list .avatar img{width:100%;height:100%;-webkit-border-radius:16px;-moz-border-radius:16px;border-radius:16px}
.chatbox .ask .content,.chatbox .answer .content{min-height:20px;padding:6px 10px;text-align:left;word-break:break-all;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px}
.chatbox .ask .content img,.chatbox .answer .content img{max-width:100%}
.chatbox .ask .avatar{float:left;margin-right:-32px}
.chatbox .ask .content{position:relative;float:left;margin-left:49px;margin-right:50px;background-color:#fff;border:1px solid #bfbfbf}
.chatbox .ask .content:before{position:absolute;left:-6px;top:8px;display:inline-block;*zoom:1;*display:inline;width:6px;height:6px;background:url("../images/chat/arrow.png") no-repeat 0 0;vertical-align:middle;content:""}
.chatbox .answer .avatar{float:right;margin-left:-32px}
.chatbox .answer .content{position:relative;float:right;margin-right:49px;margin-left:50px;background-color:#26c5d8;border:1px solid #1da4b4}
.chatbox .answer .content:after{position:absolute;right:-6px;top:8px;display:inline-block;*zoom:1;*display:inline;width:6px;height:6px;background:url("../images/chat/arrow.png") no-repeat -6px 0;vertical-align:middle;content:""}
.chatbox .bottom{width:100%}
.chatbox .bottom .form{padding:0}
.chatbox .button{float:left;width:52px;height:35px;margin-left:0px;border:0;color:#fff;background-color:#00acee;-webkit-border-radius:0 5px 5px 0;-moz-border-radius:0 5px 5px 0;border-radius:0 5px 5px 0}
.chatbox .ipt{text-align:left;margin:0 10px;line-height:20px;vertical-alip:top}
.chatbox .ipt input{height:68px;width:100%;text-indent:5px;margin-left:0px;border:none;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px}
.chatbox .ipt input:focus{outline:none}
.chatbox .send{margin:0 10px;text-align:right}
.chatbox .send span{color:#ccc;padding-right:20px}
.chatbox .insert{position:relative;height:40px;border-top:1px solid #f3ece5}
.chatbox .insert i{position:relative;top:9px;left:15px;display:block;width:22px;height:22px;content:"";background:url("../images/icon-balloon.png") no-repeat -220px -53px;cursor:pointer}
.chatbox .tab-hd{position:relative;float:left;width:140px;height:510px;margin-right:-140px;overflow-y:auto}
.chatbox .tab-hd a{position:relative;display:block;margin:5px 10px;line-height:48px;color:#1a1a1a;font-size:14px;text-decoration:none;text-align:left;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px}
.chatbox .tab-hd a:first-child{-webkit-border-radius:2px 0  0 0;-moz-border-radius:2px 0  0 0;border-radius:2px 0  0 0}
.chatbox .tab-hd a.active{background-color:#a3adb1;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px}
.chatbox .tab-hd a:hover{background-color:#74838a}
.chatbox .tab-hd .close{display:none;position:absolute;opacity:1;width:17px;height:17px;right:12px;top:12px;font-size:15px;line-height:17px;background-color:#000;text-align:center;cursor:pointer;color:#fff;-webkit-border-radius:9px;-moz-border-radius:9px;border-radius:9px}
.chatbox .tab-hd a:hover .close{display:block}
.chatbox .tab-hd .avatar{position:relative;display:inline-block;width:32px;height:32px;margin-right:10px;margin-left:6px;text-align:center;line-height:32px;font-size:14px;background-color:#e8e8e8;color:#fff;-webkit-border-radius:16px;-moz-border-radius:16px;border-radius:16px}
.chatbox .tab-hd .avatar img{width:32px;height:32px;-webkit-border-radius:16px;-moz-border-radius:16px;border-radius:16px}
.chatbox .tab-wrap{float:right;width:100%}
.chatbox .tab-bd{margin-left:140px;height:510px;background-color:#fafafa}
.chat-msg{position:fixed;bottom:10px;right:25px;width:65px;height:65px;text-align:center;background-color:#fff;cursor:pointer;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;-webkit-box-shadow:0 0 7px rgba(7,0,2,0.2);-moz-box-shadow:0 0 7px rgba(7,0,2,0.2);box-shadow:0 0 7px rgba(7,0,2,0.2)}
.chat-msg .num{position:absolute;top:-16px;left:-16px;display:block;margin:8px 0 0 4px;width:20px;height:20px;line-height:16px;background-color:#465a63;color:#fff;border:2px solid #fff;text-align:center;font-size:13px;-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px}
.chat-msg .icon{display:block;width:46px;height:46px;margin:12px 0 0 12px;background:url("../images/icon-balloon.png") no-repeat -210px -83px;cursor:pointer}
.chat-msg .icon.active{-webkit-animation:flipinY 1s infinite;-o-animation:flipinY 1s infinite;animation:flipinY 1s infinite}
.chat-msg.z-dis .icon{background-position:-210px -135px}
.chat-msg.z-dis .num{background-color:#999}
.face{display:none;position:absolute;z-index:999;bottom:31px;left:0px;width:400px;padding:0px 0px;background:#fff none repeat scroll 0 0;border:1px solid #CCCCCC;text-align:left;margin:0px 0px}
.face .face-tt{height:28px;margin:0px 0px;padding:0;background:#F0F0F0}
.face .close{position:absolute;right:14px;top:5px;height:19px;width:19px;z-index:99;display:block;background:url("../images/chat/close.gif") no-repeat scroll transparent;cursor:pointer}
.face .face-bd{width:367px;margin:10px 15px 20px;border-top:1px solid #e8e8e8;border-left:1px solid #e8e8e8}
.face .list ul{background:#fff;margin:0px 0px;padding:0}
.face .list li{float:left;padding:4px;background:#fff;border-right:solid 1px #e8e8e8;border-bottom:solid 1px #e8e8e8;overflow:hidden;cursor:pointer;box-sizing:border-box}
.face .list img{float:left;display:block;width:52px;height:52px;line-height:22px;background:#fff}
.face .list li:hover{margin-left:-1px;margin-top:-1px;border:1px solid #0095cd}
.chatbox .calendar{margin:25px 10px 27px;background:url("../images/chat/calendar.png") no-repeat}
.chatbox .calendar .create{padding-left:42px;color:#959697;font-size:14px}
.chatbox .calendar .at{padding-left:42px;color:#1a1a1a;font-size:14px}
.chatbox .group{position:relative;text-align:left}
.chatbox .group .total{height:20px;width:100%;background:#e1e4e6;color:#333;text-align:left;padding:0 10px;line-height:20px;font-size:12px}
.chatbox .group ul{height:307px;padding:9px 10px 0;margin-bottom:0;overflow-y:auto;overflow-x:hidden;list-style:none}
.chatbox .group li{position:relative;padding:3px 0;text-align:left;list-style:none}
.chatbox .group .avatar{position:relative;top:4px;display:inline-block;*zoom:1;*display:inline;width:18px;height:18px;overflow:hidden;margin-right:6px;background:#ccc;color:#fff;text-align:center;-webkit-border-radius:9px;-moz-border-radius:9px;border-radius:9px}
.chatbox .group .avatar img{display:block;width:100%;height:100%}
.chatbox .group a{display:block;color:#333333;font-size:12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.chatbox .add{display:block;height:42px;line-height:42px;text-align:center;color:#465a63;background:#e1e4e6;cursor:pointer}
.chatbox .add i{position:relative;top:4px;display:inline-block;*zoom:1;*diplay:inline;width:15px;height:15px;margin-right:2px;background:url("../images/chat/add.png") no-repeat}
.chatbox .add:hover{background-color:#26c5d8;color:#fff;text-decoration:none}
.chatbox .group .dropdown{position:absolute;z-index:2;width:126px;left:0;top:26px;border:1px solid #d9d9d9;background-color:#fff}
.chatbox .group .dropdown a{display:block;line-height:36px;border-top:1px solid #d9d9d9;text-align:center}
.chatbox .group .dropdown a:first-child{border-top:none}
.chatbox .group .dropdown a.active,.chatbox .group .dropdown a:hover{color:#fff;background-color:#26c5d8;text-decoration:none}
.rollbar-path-vertical,.rollbar-path-horizontal{position:absolute;z-index:100;background-color:rgba(220,220,220,0.5)}
.rollbar-path-horizontal{bottom:5px;height:10px;left:0;width:100%}
.rollbar-path-vertical{right:5px;top:0;width:10px;height:100%}
.rollbar-path-vertical{right:0}
.rollbar-handle{position:relative;left:0;background-color:#58bcee;top:0}
.rollbar-handle{-moz-user-select:none}
.rollbar-path-vertical .rollbar-handle{height:20%;width:100%}
.rollbar-path-horizontal .rollbar-handle{height:100%;width:20%}
.rollbar-path-vertical,.rollbar-path-horizontal,.rollbar-handle{border-radius:5px}
@-webkit-keyframes flipinY{
	0%{-webkit-transform:perspective(400px) rotateY(90deg);opacity:0}
	40%{-webkit-transform:perspective(400px) rotateY(-10deg)}
	70%{-webkit-transform:perspective(400px) rotateY(10deg)}
	100%{-webkit-transform:perspective(400px) rotateY(0);opacity:1}
}
@-moz-keyframes flipinY{
	0%{-moz-transform:perspective(400px) rotateY(90deg);opacity:0}
	40%{-moz-transform:perspective(400px) rotateY(-10deg)}
	70%{-moz-transform:perspective(400px) rotateY(10deg)}
	100%{-moz-transform:perspective(400px) rotateY(0);opacity:1}
}
@-ms-keyframes flipinY{
	0%{-ms-transform:perspective(400px) rotateY(90deg);opacity:0}
	40%{-ms-transform:perspective(400px) rotateY(-10deg)}
	70%{-ms-transform:perspective(400px) rotateY(10deg)}
	100%{-ms-transform:perspective(400px) rotateY(0);opacity:1}
}
@keyframes flipinY{
	0%{transform:perspective(400px) rotateY(90deg);opacity:0}
	40%{transform:perspective(400px) rotateY(-10deg)}
	70%{transform:perspective(400px) rotateY(10deg)}
	100%{transform:perspective(400px) rotateY(0);opacity:1}
}
